// pages/home/playAudio/index.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    audioSrc: [], // 音频文件的路径
    audioContext: null, // InnerAudioContext 实例
    isPlaying: false, // 是否正在播放
    isArea: false,
    keyword: '', //搜索--关键字
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 保存this指向
    var that = this
    var areaflagJudge = wx.getStorageSync('areaflag')
    // 判断进入的页面是民族还是地区,初始化对应页面的数据
    if (areaflagJudge == '') {
      this.setData({
        isArea: false
      })
      // 调地区接口
      this.getNationData(that)
    } else {
      this.setData({
        isArea: true
      })
      // 调民族接口
      this.getAreaData(that)
    }
    this.data.audioContext = wx.createInnerAudioContext();
    // 设置音频文件的路径
  },

  // 调用后台地区数据接口
  getAreaData(that) {
    console.log(wx.getStorageSync('areaflag'))
    wx.request({
      url: 'http://localhost:8089/wx/regin/regionList',
      data: {
        regionFlag: wx.getStorageSync('areaflag')
      },
      success(res) {
        console.log(res.data)
        that.setData({
          // 地区标志
          regionFlag: wx.getStorageSync('areaflag'),
          // 数据集
          areaData: res.data,
          //areaData和audioSrc这俩是一样的
          audioSrc: res.data
        })
      }
    })
  },
  // 调用后台民族数据接口
  getNationData(that) {
    console.log(wx.getStorageSync('nationflag'))
    wx.request({
      url: 'http://localhost:8089/wx/nation/nationList',
      data: {
        nationFlag: wx.getStorageSync('nationflag')
      },
      success(res) {
        console.log(res.data)
        that.setData({
          // 地区标志
          nationFlag: wx.getStorageSync('nationflag'),
          // 数据集
          nationData: res.data,
          //areaData和audioSrc这俩是一样的
          audioSrc: res.data
        })
      }
    })
  },
  // 搜索接口
  onInput() {
    // 保存this指向
    var that = this
    // 判断条件
    var areaflagJudge = wx.getStorageSync('areaflag')
    if (areaflagJudge == '') {
      wx.request({
        url: 'http://localhost:8089/wx/nation/nationQuery',
        data: {
          keyword: this.data.keyword,
          nationFlag: wx.getStorageSync('nationflag')
        },
        success(res) {
          // console.log(res.data)
          that.setData({
            // 地区标志
            nationFlag: wx.getStorageSync('nationflag'),
            // 数据集
            nationData: res.data,
            //areaData和audioSrc这俩是一样的
            audioSrc: res.data
          })
        }
      })
    } else {
      wx.request({
        url: 'http://localhost:8089/wx/regin/regionQuery',
        data: {
          keyword: this.data.keyword,
          regionFlag: wx.getStorageSync('areaflag')
        },
        success(res) {
          console.log(res.data)
          that.setData({
            // 地区标志
            regionFlag: wx.getStorageSync('areaflag'),
            // 数据集
            areaData: res.data,
            //areaData和audioSrc这俩是一样的
            audioSrc: res.data
          })
        }
      })
    }
  },
  // 播放或暂停音频
  toggleAudio: function (e) {
    let index = e.currentTarget.dataset.index
    console.log(index);
    if (this.data.audioSrc[index].isplay != 0) {
      // 如果正在播放，则暂停音频
      this.data.audioContext.pause();
      this.data.audioSrc[index].isplay = 0
      this.setData({
        areaData: this.data.audioSrc
      })
    } else {
      // 判断条件
      var areaflagJudge = wx.getStorageSync('areaflag')
      // 如果未播放，则开始播放音频，播放对应语音
      // 字段不同，故做判断，判断地区标记是否存在，若不存在则说明进入的是民族页面
      if (areaflagJudge == '') {
        this.data.audioContext.src = this.data.audioSrc[index].nationVoiceurl;
        this.data.audioContext.play();
        this.data.audioSrc[index].isplay = 1
        this.setData({
          nationData: this.data.audioSrc
        })
        this.isOver(index)
      } else {
        this.data.audioContext.src = this.data.audioSrc[index].nationAreaVoiceurl;
        this.data.audioContext.play();
        this.data.audioSrc[index].isplay = 1
        this.setData({
          areaData: this.data.audioSrc
        })
        this.isOver(index)
      }
      console.log("isplay", this.data.audioSrc[index].isplay);
    }
  },
  // 封装监听方法
  isOver(index) {
    // 判断条件
    var areaflagJudge = wx.getStorageSync('areaflag')
    if (areaflagJudge == '') {
      this.data.audioContext.onEnded(() => {
        this.data.audioSrc[index].isplay = 0
        this.setData({
          nationData: this.data.audioSrc
        });
      });
      this.startProgress();
    } else {
      this.data.audioContext.onEnded(() => {
        this.data.audioSrc[index].isplay = 0
        this.setData({
          areaData: this.data.audioSrc
        });
      });
      this.startProgress();
    }
  },
  // 进度条
  startProgress: function () {
    const that = this;
    let percent = 0;
    const timer = setInterval(() => {
      percent += 1;
      if (percent > 100) {
        clearInterval(timer);
        return;
      }
      that.setData({
        progress: percent,
      });
    }, 100);
  },




  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})